import 'package:flutter/material.dart';
import 'package:flutter04/res/list_data.dart';

class GridViewPage extends StatefulWidget {
  const GridViewPage({super.key});

  @override
  State<GridViewPage> createState() => _GridViewPageState();
}

class _GridViewPageState extends State<GridViewPage> {
  Widget _initListData(context, index) {
    return GestureDetector(
      onTap: () {
        Navigator.pushNamed(context, "/hp", arguments: {
          "imageUrl": listData[index]["imageUrl"],
          "listData": listData,
          "initialPage": index,
        });
      },
      child: Container(
        alignment: Alignment.center,
        decoration: BoxDecoration(border: Border.all(color: Colors.black26)),
        child: Column(
          children: [
            SizedBox(
              height: 150,
              child: Hero(
                tag: listData[index]["imageUrl"],
                child: Image.network(
                  listData[index]["imageUrl"],
                  fit: BoxFit.cover,
                ),
              ),
            ),
            SizedBox(
              height: 30,
              child: Text(
                listData[index]['title'],
                style: const TextStyle(color: Colors.blue, fontSize: 18),
              ),
            ),
          ],
        ),
      ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('GridView'),
      ),
      body: GridView.builder(
        itemCount: listData.length,
        gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 2,
          crossAxisSpacing: 10,
          mainAxisSpacing: 10,
          childAspectRatio: 0.9,
        ),
        padding: const EdgeInsets.all(10),
        itemBuilder: _initListData,
      ),
    );
  }
}
